<template>
  <view class="minMessageDetails">
    <!-- 消息详情 -->
    <view class="content_item unRead">
      <view class="icon_img">
        <i class="blue iconfont icon-regular"></i>
        <i v-if="false" class="yellow iconfont icon-xitongtongzhi"></i>
        <i v-if="false" class="red iconfont icon-a-Group33633"></i>
        <i v-if="false" class="red iconfont icon-xitongtongzhi"></i>
      </view>
      <view class="title flex">
        <p>{{ messageItem.title }}</p>
      </view>
      <view class="message">
        <view class="time">
          <span style="color: #000"> 时间：</span>
          {{ messageItem.create_time }}
        </view>
        <view class="msg">
          <span style="color: #000"> 详情：</span>
          {{ messageItem.content }}
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import { messageDetails } from "@/common/api/index";
export default {
  name: "minMessageDetails",
  data() {
    return {
      messageItem: {},
    };
  },
  onLoad(options) {
    uni.showLoading({
      title: "加载中...",
    });
    let formData = {
      id: options.id,
    };

    messageDetails(formData).then((res) => {
      if (res.code == 1) {
        this.messageItem = res.data;
        uni.hideLoading();
      } else {
        this.showMsg(res.msg);
      }
    });
  },
};
</script>

<style scoped lang="scss">
.minMessageDetails {
  background-color: #f8f8f8;
  padding: 0 20rpx 20rpx;
  height: 100vh;
  overflow: auto;
  box-sizing: border-box;
  .content_item {
    margin-top: 20rpx;
    padding: 20rpx;
    border-radius: 20rpx;
    position: relative;
    .title {
      justify-content: center;
      font-size: 50rpx;
      font-weight: 600;
    }
    .doing {
      justify-content: space-around;
      margin-top: 20rpx;
    }
    .doingEnd {
      margin-top: 40rpx;
      justify-content: flex-end;
    }
    .icon_img {
      margin: 40rpx auto;
      width: 30%;
      text-align: center;
      .iconfont {
        font-size: 100rpx;
        margin-right: 10rpx;
      }
    }
    .message {
      margin-top: 40rpx;
      font-size: 40rpx;
      color: #999;
      view {
        margin-top: 20rpx;
      }
    }
  }
}
</style>
